feat: add transition router feature #11364
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
Codecov ReportPatch coverage has no change and project coverage change:
Additional details and impacted files@@ Coverage Diff @@
## master #11364 +/- ##
==========================================
- Coverage 29.03% 29.00% -0.04%
==========================================
Files 484 485 +1
Lines 14667 14684 +17
Branches 3460 3463 +3
==========================================
Hits 4259 4259
- Misses 9657 9672 +15
- Partials 751 753 +2
☔ View full report in Codecov by Sentry. |
| const originPush = h.push | ||
| const originReplace = h.replace | ||
| h.push = (...args) => { | ||
| startTransition(() => originPush.apply(h, args)) |
There was a problem hiding this comment.
试了下会影响约定式 loading 的功能，在 startTransition 中切换路由时，Suspense 的 fallback 组件就不会渲染了，不知道有没有其他解法
There was a problem hiding this comment.
是的，因为 startTransition 标记这个不是紧急的渲染，这样 fallback 就不会立即出现切换 UI ，这个是符合 startTransition 预期的，由于 Suspense 的 fallback 其实很短，会一闪而过，体验不好，所以为了提升体验，现在更推荐使用非紧急的更新切换路由，包括 nextjs 等也是一样，切换的时候会阻塞，不会闪屏 loading 。
There was a problem hiding this comment.
其他框架的页面 loading 方案是怎么处理的呢，开启这个 Umi 的 loading 就失效了，希望能在解决注水错误的同时让 loading 继续生效
根据 remix-run/remix#5763 、React Docs Suspense 中的经验，我们把路由切换包裹在
startTransition中，标记为非紧急更新，这可以避免 Suspense 的 fallback 闪烁问题，提升体验。同时这应该可以解 antd 文档过早切换路由，水合失败的问题，详见：antd docs link 代码
cc @PeachScript